setTimeout与setInterval
chenpeng 2020-12-02 JS引擎
# setTimeout
语法
setTimeout(function[, delay, arg1, arg2, ...])
1
function:延迟时间(delay)到期之后执行的函数delay:延迟的毫秒数,默认为0arg1, ..., argN:附加参数,定时器到期后,会作为参数传给function
# setInterval
语法
setInterval(function[, delay, arg1, arg2, ...])
1
function:每经过延迟时间(delay)之后执行的函数delay:每次延迟的毫秒数,默认为10arg1, ..., argN:附加参数,定时器到期后,会作为参数传给function
# setTimeout 与 setInterval 存在的问题
setTimeout 与 setInterval 实际的延迟时间可能会比设定值更长
在 JS 事件循环中,执行栈中首先执行宏任务,遇到微任务则将其添加到任务队列里,当宏任务执行结束,执行栈空闲时,再从任务队列中取出微任务执行,而定时器属于宏任务,如果当前执行栈所花费的时间大于定时器设置的延迟时间,会导致定时器的回调在宏任务里来不及调用,所以时间会有误差
# 使用 setTimeout 实现 setInterval
function newInterval(fn, delay){
function inside(){
fn();
setTimeout(inside, delay);
}
inside();
}
1
2
3
4
5
6
7
2
3
4
5
6
7